<template>
  <div class="news-category-selector">
    <el-table
      :data="categoryList"
      ref="tab"
      border
      height="250"
      @current-change="onSelectRow"
      highlight-current-row
    >
      <el-table-column prop="name" label="分类" />
    </el-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      categoryList: []
    }
  },
  props: {
    selectedId: {
      type: String,
      required: false,
      default: ''
    }
  },
  methods: {
    async loadNewsCategoryList() {
      var res = await this.$http.post('/news-admin/category/select')
      this.categoryList = res.data
    },
    onSelectRow(val) {
      if (!val) return
      this.$emit('onSelect', { id: val.id, title: val.name })
    }
  },
  async mounted() {
    await this.loadNewsCategoryList()
    if (this.selectedId) {
      let row = this.categoryList.find(x => x.id === this.selectedId)
      this.$nextTick(() => {
        this.$refs.tab.setCurrentRow(row)
      })
    }
  }
}
</script>

<style>
</style>
